<template>
<!--  组件结构-->
  <div class="school">
      <h2>{{msg}}</h2>
      <h3>姓名：{{name}}</h3>
      <h3>性别：{{sex}}</h3>
    <h2>number求和{{number}}</h2>
    <button @click="add">点我number++</button>
    <button @click="showstudentname()">点我展示学生名</button>
    <button @click="nobin()">解绑自定义事件</button>
    <button @click="death">销毁当前student组件实例</button>
  </div>
</template>

<script>
//组件交互相关代码（数据、方法等）
   export default{
     name:'Student',
    data(){
      return {
        msg:'我是召唤师峡谷的一名英雄',
        name:'赵鑫',
        sex: '男',
        number:0
        }
    },
     methods:{
       add(){
         console.log("add回调被调用")
         this.number++
       },
       showstudentname(){
         //触发student组件实例上的guigu事件
         this.$emit('guigu',this.name,66,88,999)
         this.$emit('demo')
         //this.$emit('click')
       },
       nobin(){
          this.$off('guigu')  //解绑一个自定义事件
          //this.$off(['guigu','demo'])  //解绑多个自定义事件
          // this.$off()  //解绑所有自定义事件

       },
       death(){
         this.$destroy()  //销毁当前组件实例对象   销毁后所有student实例的自定义事件全部都不奏效
       }
     }

  }

</script>

<style scoped>
/*组件样式*/
  .school{
    background-color: rgb(231, 139, 73);
    padding: 5px;
    margin-top: 30px;
  }
</style>